<template>
	<h2>子组件</h2>
	<slot name='header' msg='这是头部' txt='好好努力'></slot>
	<slot name='content' :user='user'></slot>
	<slot name='footer' :list='list'></slot>
</template>

<script setup>
	import {reactive} from 'vue'
	// 1.插槽的标签  <slot></slot>  预留的占位符
	//2.在子组件中定义插槽
	//3.一个页面可以有多个插槽
	//4.具名插槽 添加name属性 ，默认name=defalut
	//5.具名插槽 父组件数据传递给子组件数据的 template v-slot:具名插槽名称  简称#
	//6.作用域插槽 子组件向父组件传递数据
	//定义数据
	const user=reactive({
		name:'赖翔耀',
		age:20,
		gender:'男'
	})
	const list=reactive(['友情链接1','友情链接2'])
</script>

<style scoped>
</style>